Estoy usando almacenamiento local para almacenar un elemento div. Sin embargo, al final quiero recuperar ese elemento div del almacenamiento local, pero cada vez que lo hago, obtengo el resultado: "[object HTMLDivElement]", que es una cadena
¿Hay alguna forma de convertir este resultado recibido en un elemento HTML, de modo que pueda obtener el mismo div que almacené al principio?
Una buena idea sería transformar el objeto DOM en una cadena HTML pura y luego guardarlo en el almacenamiento local.
Mire esto para obtener más información: Parse HTML String to DOM y conviértalo de nuevo en cadena
localStorage solo puede almacenar cadenas . No puede almacenar nodos DOM en él, JS simplemente dirá "sí, eso no funciona, déjame convertirlo en una cadena primero" y usará la cadena genérica "tipo de objeto entre paréntesis".
Si desea almacenar un elemento HTML, no almacene el elemento en sí, pero almacene su código fuente HTML externo, que es una cadena.
// convert page element to string: function storeElement(element, keyName) { localStorage.setItem(keyName, element.outerHTML); } // reconstitute the page element from string: function retrieveElement(keyName, preserve=false) { const stored = localStorage.getItem(keyName); if (!preserve) localStorage.removeItem(keyName); const helper = document.createElement(`section`); helper.innerHTML = stored; return helper.childNodes[0]; }